<template>
	<view class="fui-wrap" style="padding: 50rpx 0;">
		<view v-if="err" style="padding-bottom: 200rpx;">
			<fui-result type="fail" title="操作失败" :descr="err"></fui-result>
		</view>
		<block v-else>
			<view class="pic">
				<image mode="widthFix" :src="`${baseUrl}assets/img/miniapp/sche.png`" style="width: 100%;"></image>
			</view>
			<view class="bk" v-if="temp">
				<view class="title">
					<fui-text text="车牌号：" size="42" block fontWeight="800" color="#242424"></fui-text>
					<platetype :plate_number="temp.plate_number" :plate_type="plate_type" :size="46"></platetype>
				</view>
				<view class="des">
					<view class="success">
						<fui-icon name="checkbox" color="green" size="50"></fui-icon>
						<fui-text text="领取临时牌照成功！" size="32" color="green" font-weight="bolder" ></fui-text>
					</view>
					<fui-alert type="warn" title="确保您的车是无牌车"></fui-alert>
					<fui-alert type="warn" title="确保您的车曝光在摄像头前面"></fui-alert>
				</view>
			</view>
			<view class="line">
				<fui-button :disabled="disabledbtn" @click="entry">确认开闸</fui-button>
			</view>
		</block>
	</view>
</template>

<script>
	import {methods,baseUrl} from '@/utils/core.js';
	import platetype from '@/components/common/platetype.vue';
	export default {
		components:{
			platetype:platetype
		},
		data() {
			return {
				baseUrl:baseUrl,
				err:'',
				temp:'',
				barrier:'',
				plate_type:'blue',
				disabledbtn:false
			}
		},
		onLoad(e) {
			this.$get('index/get-temporary',{scan_id:e.scan_id},true).then(res=>{
				this.temp=res.temp;
				this.barrier=res.barrier;
			}).catch(err=>{
				this.err=err.msg;
			});
		},
		methods: {
			...methods,
			entry:function(){
				this.disabledbtn=true;
				this.$post('index/open-temporary',{temp_id:this.temp.id,serialno:this.barrier.serialno},true,true).then(res=>{
					
				}).catch(err=>{
					this.disabledbtn=false;
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.fui-wrap{
		background-color: #fff;
	}
	.pic{
		padding: 40rpx 30rpx;
		border: 10rpx dashed gray;
		width: 80%;
		margin: 0 auto;
	}
	.bk{
		padding: 20rpx;
		.title{
			margin: 30rpx 0;
			display: flex;
			align-items: center;
			justify-content: center;
		}
		.des{
			display: flex;
			flex-direction: column;
			height: 300rpx;
			justify-content: space-between;
			.success{
				display: flex;
				align-items: center;
				justify-content: center;
			}
		}
	}
	.line{
		position: fixed;
		bottom: 20rpx;
		width: 92%;
		left: 4%;
	}
</style>